
<template>
  <div style="height:100%;width:100%;padding: 0;background-image: linear-gradient(to right top, #a1d1ff, #c2daff, #dce5ff, #f0f1ff, #ffffff);">
    <el-row style="height: 50%; border: 2px dashed grey; display: flex; justify-content: center; align-items: center;">
      <el-col align-self="center" style="width: 100%;">
        <el-card style="background-color: transparent; margin-top: 40px;">
          <el-descriptions title="用户信息" border style="border: 1px solid; background-color: white;  margin-top: 20px;">
            <el-descriptions-item label="学号">{{ user.account }}</el-descriptions-item>
            <el-descriptions-item label="姓名">{{ user.name }}</el-descriptions-item>
            <el-descriptions-item label="性别">{{ user.gender }}</el-descriptions-item>
            <el-descriptions-item label="生源地">{{ user.birthplace }}</el-descriptions-item>
            <el-descriptions-item label="专业">{{ majorName }}</el-descriptions-item>
            <el-descriptions-item label="学院">{{ collegeName }}</el-descriptions-item>
            <el-descriptions-item label="所在园区">{{ areaName }}</el-descriptions-item>
            <el-descriptions-item label="所在楼栋">{{ buildingName }}</el-descriptions-item>
            <el-descriptions-item label="所在房间">{{ roomName }}</el-descriptions-item>

          </el-descriptions>
          <el-button type="primary" style="margin-left: 580px;margin-top: 20px" @click="modifyStudent">修改密码</el-button>
        </el-card>
      </el-col>
    </el-row>
    <student-edit-dialog  @ok="handleModifyOK"  ref="StudentEditDialog"></student-edit-dialog>
  </div>
</template>
<script>
import {_selectMajorNameAndCollegeNameByStudentID} from '../../../api/student'
import studentEditDialog from '../components/editDialogComponent/StudentEditDialog.vue'
import {_searchStudentByNameAndAccount} from '../../../api/super_admin'
export default {
  components: {
    studentEditDialog
  },
  created () {
    this.init()
  },
  data () {
    return {
      user: {
        account: '',
        name: '',
        gender: '',
        birthplace: '',
        major: '',
        nation: ''
      },
      majorName: '计算机科学与技术',
      collegeName: '计算机学院',
      roomName: '',
      buildingName: '',
      areaName: ''
    }
  },
  methods: {
    modifyStudent () {
      this.$refs.StudentEditDialog.show(this.user)
    },
    handleModifyOK (newPassword) {
      let newUser = JSON.parse(localStorage.getItem('user'))
      newUser.password = newPassword
      localStorage.removeItem('user')
      localStorage.setItem('user', newUser)
    },
    async init () {
      this.user = JSON.parse(localStorage.getItem('user'))
      await _selectMajorNameAndCollegeNameByStudentID(this.user.id).then(res => {
        if (res.status) {
          this.collegeName = res.data.collegeName
          this.majorName = res.data.majorName
        }
      })
      const DOT = {
        pageSize: 10000,
        pageNo: 1,
        data: {
          studentName: this.user.name,
          studentAccount: this.user.account
        }
      }
      await _searchStudentByNameAndAccount(DOT).then(res => {
        if (res.status) {
          for (let i = 0; i < res.data.length; i++) {
            if (res.data[i].student.account === this.user.account) {
              this.areaName = res.data[i].areaName
              this.buildingName = res.data[i].buildingName
              this.roomName = res.data[i].roomName
              break
            }
          }
        } else {
          this.$message({
            message: res.message,
            type: 'error'
          })
        }
      })
    }
  }

}
</script>
<style scoped>

</style>
